import React from 'react';
import Portal from 'components/portal';
import PropTypes from 'prop-types';
import css from './index.less';

/**
 * 专用于Motion区域的portal
 */
export default class MotionPortal extends React.Component {

  static propTypes = {
    isOpen: PropTypes.bool,
  };

  static defaultProps = {
    isOpen: false,
  };

  renderPopover() {
    const { children } = this.props;
    // 弹层定位
    const popoverProps = {
      className: css.popover,
    };

    return (
      <div {...popoverProps}>
        {children}
      </div>
    );
  }

  render() {
    const { isOpen } = this.props;
    const props = {
      isOpen,
    };

    return (
      <Portal {...props}>
        {this.renderPopover()}
      </Portal>
    );
  }
}
